﻿/* ******************************************************
* 名    称：jQuery.showDetail()
* 功    能：鼠标滑过时，显示指定的信息
* 创建作者：ThinkWang
* 创建时间：2012年8月24日
* ******************************************************
*/
$.fn.extend({
    showDetail: function (info) {
        return this.each(function () {
            //被滑过的当前对象;
            var $obj = $(this);
            $obj.hover(
            //mouseover
                function () {
                    //如果是第一次，没有弹出层的jquery对象，就新建一个对象
                    if ($("#detail_info_div").size() < 1) {
                        $("body").append('<div id="detail_info_div" class="showDetail_WF"><div class="showDetail_WF_top"></div><div class="showDetail_WF_mid">' + info + '</div><div class="showDetail_WF_bottom"></div></div>');
                    }
                    $("#detail_info_div").find(".showDetail_WF_mid").html(info);
                    $("#detail_info_div").css({
                        "top": $obj.offset().top + $obj.height(),
                        "left": $obj.offset().left
                    })
                    .show();
                },
            //mouseout
                function () {
                    $("#detail_info_div").hide();
                });
        }); //each结束
    } //showDetail结束
});  //extend结束